import React, { useEffect, useState } from 'react'
import { Table, Button, Modal,notification } from 'antd'
import axios from 'axios'
import { EditOutlined, DeleteOutlined, CloudUploadOutlined} from '@ant-design/icons';

function NewsDraft(props) {
    const [dataSource, setdataSource] = useState([])
    // table显示结构
    const columns = [
        {
            title: "ID",
            dataIndex: "id",
        },
        {
            title: "新闻标题",
            dataIndex: "title",
            render:(title,item)=>{
                return <a href={`#/news-manage/preview/${item.id}`}>{title}</a>
            }
        },
        {
            title: "作者",
            dataIndex: "author",
        },
        {
            title: "分类",
            dataIndex: "categoryId",
            // render:(category)=>{
            //     return category.title
            // }
        },
        {
            title: "操作",
            dataIndex: "",
            render: (item) => {
                return <div>
                    <Button type="danger" shape="circle" icon={<DeleteOutlined />} onClick={() => deleteConfirm(item)} />
                    <Button type="primary" shape="circle" icon={<EditOutlined />} onClick={()=>{
                        props.history.push(`/news-manage/update/${item.id}`)
                    }} />
                    <Button type="primary" shape="circle" icon={<CloudUploadOutlined />} onClick={() => handelCheck(item.id)} />
                </div>
            }
        }
    ]

    // 审核通过
    const handelCheck=(id)=>{
        axios.patch('/news/'+id,{
            auditState:1
        }).then(res=>{
            const args = {
                message: 'Notification Title',
                description: `你可以到审核列表中查看你的新闻` ,
                duration: 3,
              };
              notification.open(args);
            props.history.push('/audit-manage/list')


        })
    }
    //删除确认框
    var deleteConfirm = (item) => {
        console.log(item);
        Modal.confirm({
            title: 'Confirm',
            icon: <DeleteOutlined />,
            content: '确定删除该草稿？',
            onOk() {
                deleteMethod(item)
                console.log(111);
            },
            onCancel() {
                console.log('Cancel');
            },
        });
    }
    // 执行删除方法
    var deleteMethod = (item) => {
        setdataSource(dataSource.filter(data => data.id !== item.id))
        console.log(item.id);
        axios.delete(`/news/${item.id}`)
    }
    // 获取全部数据

    var getList = async () => {

    }
    const {username}= JSON.parse(localStorage.getItem("token"))
    useEffect(() => {
        axios.get(`/news?author=${username}&auditState=0&_expand=category`).then(res=>{
            console.log(res);
            setdataSource(res.data)
        })
    }, [])
    return (
        <div>
            <Table dataSource={dataSource} columns={columns} rowKey={(item) => item.id} pagination={{
                pageSize: 5
            }} />
        </div>
    )
}
export default NewsDraft